<template>
    <div class="Login">
        <!-- 头部 -->
        <div class="header">
            <div class="w1200">
                <router-link :to="{name:'Index'}" class="logo fl"><img src="../assets/logo.png"></router-link>
                <div class="goRecruit"><a :href="entUrl" target="_blank">我要招聘</a></div>
            </div>
        </div>
        <div class="main">
            <div class="w1200">
                <!-- 注册 -->
                <div class="box fr">
<!--                    <div class="wechatLoginFlag" @click="wechatLoginPop"><span></span>微信快速登录</div>-->
                    <div class="tabs">
                        <!-- <div class="item active">我要找工作</div>
                        <div class="item"><a :href="entUrl" target="_blank">我要招聘</a></div> -->
                        <div class="item" :class="form.loginMode == 1 ? 'active' : ''" @click="changeLoginMode(1)">
                            短信登录
                        </div>

                        <div class="item" :class="form.loginMode == 2 ? 'active' : ''" @click="changeLoginMode(2)">
                            密码登录
                        </div>
                    </div>
                    <div v-if="form.loginMode == 1" @touchmove.prevent>
                        <el-form class="form" :model="form" :rules="rules" ref="form">
                            <el-form-item prop="phone">
                                <el-input type="text" :maxlength="11" v-model.trim="form.phone"
                                          placeholder="请输入手机号"></el-input>
                            </el-form-item>
                            <el-form-item prop="dragVerify">
                                <drag-verify ref="dragVerify" :width="330" :height="42" radius="0"
                                             :isPassing.sync="isPassingFlag" text="请按住滑块拖动" successText="验证通过"
                                             handlerIcon="el-icon-d-arrow-right" successIcon="el-icon-circle-check">
                                    <i v-show="!isPassingFlag" slot="textBefore" class="el-icon-lock"></i>
                                </drag-verify>
                            </el-form-item>
                            <el-form-item class="code" prop="code">
                                <el-input type="text" ref="code" maxlength="6" v-model.trim="form.code"
                                          placeholder="请输入验证码"></el-input>
                                <el-button type="text" :disabled="disabledFlag" @click="getCode">{{ codeName }}
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" class="btn" @click="submit">登录/注册</el-button>
                            </el-form-item>
                            <el-form-item class="other" prop="agree">
                                <div class="left fl">
                                    <el-checkbox v-model="agreeFlag"></el-checkbox>
                                    我已同意<a href="javascript:" @click="agreementFlag=true">用户协议</a>和<a
                                    href="javascript:" @click="privacyFlag=true">隐私政策</a></div>
                            </el-form-item>
                        </el-form>
                    </div>

                    <div v-if="form.loginMode == 2" @touchmove.prevent>
                        <el-form class="form" :model="form" :rules="rules" ref="form">
                            <el-form-item prop="username">
                                <el-input v-model.trim="form.username" placeholder="请输入手机号" maxlength="11"></el-input>
                            </el-form-item>
                            <el-form-item prop="password">
                                <el-input v-model.trim="form.password" type="password" placeholder="请输入密码"></el-input>
                            </el-form-item>
                            <el-form-item prop="captcha">
                                <el-input
                                    ref="captcha"
                                    v-model="form.captcha"
                                    placeholder="请输入验证码"
                                    name="captcha"
                                    type="text"
                                    maxlength="4"
                                    tabindex="1"
                                    autocomplete="on"
                                >
                                    <template slot="append"><img @click="getRandomImage"
                                                                 style="cursor: pointer;max-width: none;"
                                                                 :src="randomImg" alt=""></template>
                                </el-input>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" class="btn" @click="submit">登录</el-button>
                            </el-form-item>

                            <el-form-item class="other" prop="agree">
                                <div class="left fl">
                                    <el-checkbox v-model="agreeFlag"></el-checkbox>
                                    我已同意<a href="javascript:" @click="agreementFlag=true">用户协议</a>和<a
                                    href="javascript:" @click="privacyFlag=true">隐私政策</a></div>
                            </el-form-item>
                        </el-form>
                    </div>

                    <!-- <div style="text-align: center;">
                        <el-button type="text" v-if="form.loginMode == 1" @click="changeLoginMode(2)">切换密码登录</el-button>
                        <el-button type="text" v-if="form.loginMode == 2" @click="changeLoginMode(1)">切换短信登录</el-button>
                    </div> -->
                </div>
            </div>
        </div>
        <!-- 底部 -->
        <div class="footer">
            <div class="w1200">
                <div class="copyRight fl">Copyright © 2020 黄河人才网 <a href="http://beian.miit.gov.cn/" target="_blank">豫ICP备19003500号-2</a>
                </div>
                <div class="friendLink fr">
                    <div class="label">友情链接：</div>
                    <div class="box">
                        <div class="active"><a target="_blank" href="http://www.hnic.com.cn/">河南投资集团有限公司</a></div>
                        <dl>
                            <dd><a target="_blank" href="http://www.hnic.com.cn/">河南投资集团有限公司</a></dd>
                        </dl>
                    </div>
                </div>
            </div>
        </div>
        <!-- 微信快速登录 -->
        <div class="wechatLoginPop" v-if="wechatLoginFlag">
            <i class="btnClose el-icon-close" @click="wechatLoginPop"></i>
            <div class="wrap">
                <!-- <div class="iframe">
                    <iframe src="https://open.weixin.qq.com/connect/qrconnect?appid=wxf68ac2d384a75d96&scope=snsapi_login&redirect_uri=https://www.zhipin.com/wechat/account/login.html&state=hTjH0VQrcX9x7WtECxyehrybmGmWOORU&login_type=jssdk&self_redirect=default&styletype=&sizetype=&bgcolor=&rst=&style=white&href=https://login.zhipin.com/v2/web/geek/css/wechat-scan.css" frameborder="0"></iframe>
                </div> -->
                <div class="iframe">
                    <div class="title" @click="checkToken(-1)">微信登录</div>
                    <div class="qr" id="qrcode"></div>
                    <div class="info">
                        <div class="state state0" v-if="qrcodeState==0">
                            <p>请使用微信扫描二维码登录</p>
                            <p>“黄河人才网”</p>
                        </div>
                        <div class="state state1" v-if="qrcodeState==1">
                            <i class="el-icon-success"></i>
                            <p>扫描成功</p>
                            <p>正在登录，请稍等</p>
                        </div>
                        <div class="state state2" v-if="qrcodeState==2">
                            <i class="el-icon-warning"></i>
                            <p>您已取消此次登录</p>
                            <p>您可再次扫描登录，或关闭窗口</p>
                        </div>
                    </div>
                </div>
                <div class="overdue" v-if="overdue">
                    <div class="txt">二维码已过期</div>
                    <el-button type="primary" class="btn" @click="refreshToken()">点击刷新</el-button>
                </div>
            </div>
        </div>
        <!-- 用户协议 -->
        <el-dialog class="agreement" title="用户协议" width="1000px" :visible.sync="agreementFlag"
                   @close="agreementFlag=false">
            <div class="box">
                <p>欢迎您注册成为黄河人才网用户！黄河人才网用户服务协议（以下简称“本协议”）是由河南汇融人力资源管理有限公司（以下简称“黄河人才网”或者“我们”）和您签订。</p>
                <h2>第1条 黄河人才网用户协议的确认</h2>
                <p>
                    1、您在注册、登陆使用黄河人才网提供的各项服务之前，请您仔细阅读并理解本协议全部内容，做出您认为适当的选择。我们努力用通俗易懂、简单明了的文字表达，同时对于在本协议中与您的权益存在重大关系的条款，采用粗体字进行标注以提示您注意。当您点击“注册”或者“登录”或其他方式确认即表示您已经仔细阅读并完全理解、同意本协议项下的全部条款。</p>
                <p>
                    2、如果我们对本协议进行修改，我们将在黄河人才网网站（www.huanghehr.com）提前予以公布，更变公示期（7日）届满时生效。若您不同意修改后的协议，您有权停止使用黄河人才网服务或者注销您的黄河人才网账户；双方协商一致的，也可另行变更协议内容。您如果继续“登录”或其他方式确认，使用黄河人才网提供的服务，即表示已经仔细阅读并完全理解、同意修改后的协议。</p>
                <h2>第2条 账户的注册、使用、注销</h2>
                <p>1、在您开始注册使用黄河人才网服务前，您应当具备中华人民共和国法律规定的与您的行为相适应的民事行为能力。</p>
                <p>
                    2、您同意本协议的全部条款并按照登陆页面上的提示提供您本人真实、准确、有效信息并完成全部注册程序后，才能成为黄河人才网用户。我们通过黄河人才网平台（黄河人才网网站www.huanghehr.com、黄河人才网APP）为黄河人才网用户提供网络服务。</p>
                <p>（1）如果您是求职用户，建议您尽量完善和公开您的简历信息以更好进行求职。如您同意在您选择公开简历时，在您选择公开简历范围的黄河人才网用户可以付费下载您的简历以获取您填写的联系方式。</p>
                <p>
                    （2）如果您是招聘用户，您需要完成实名认证、实人认证并关联用人单位，保证该为职务行为后，才能使用黄河人才网提供的招聘服务。为了平台的安全运行，招聘信息的真实、有效，我们视情况定期或不定期核查已经通过认证的招聘用户，以验证认证信息的真实有效性。如在核查过程中发现招聘用户提供的信息不符合规定或虚假或无效的，我们有权对该用户及关联单位采取包括但不限于扣除资源、限制登录、暂停使用、终止合作永久封禁账户等平台管制措施。</p>
                <p>3、您应妥善保证自己的帐号和密码，您应当对以其账户进行的所有活动和事件负法律责任。如您是企业用户，您对其认证后关联的个人用户的所有行为承担连带责任。</p>
                <p>
                    4、您在使用黄河人才网网络存储平台和/或享受黄河人才网提供的服务过程中，应当遵守国家法律法规以及所有与黄河人才网服务有关的网络协议、规定、产品规则或程序，不得有下列任何行为，否则黄河人才网有权不通知您自行采取措施，包括但不限于删除用户发布的内容，限制、暂停用户使用，或终止合作永久封禁账户等措施：</p>
                <p>（1）提供虚假信息注册的（包括但不限于冒充其他人、单位）或者仿冒、混淆他人账号对外展示名称、头像或者发布让人容易产生混淆、误解的内容的行为；</p>
                <p>（2）在黄河人才网平台上骚扰、辱骂、歧视、威胁他人或存在其他不正当行为；</p>
                <p>（3）通过任何技术手段侵入我们的软件、网站、数据库等系统或者干扰黄河人才网产品和/或</p>
                <p>（4）任何利用自有或第三方的插件、程序抓取、读取、收集黄河人才网平台展示的任何信息的；</p>
                <p>（5）侵犯黄河人才网或第三方的专利权、著作权、商标权、名誉权或其他任何合法权益的行为；</p>
                <p>（6）未经黄河人才网许可，在黄河人才网平台发布广告或营销行为；</p>
                <p>（7）利用黄河人才网平台发布、传输任何新闻信息，包括但不限于有关政治、经济、军事、外交等社会公共事务的报道、评论，以及有关社会突发事件的报道、评论；</p>
                <p>（8）其他违反国家法律法规以及所有与黄河人才网服务有关的网络协议、规定、产品规则或程序的行为。</p>
                <p>5、招聘用户还需遵守黄河人才网公布《信用分规则》、《职位发布规则》。</p>
                <p>6、您在与黄河人才网上公布信息的个人或公司沟通时，保证在黄河人才网平台上进行。</p>
                <p>7、您知晓并同意在拨打黄河人才网电话时均可能会被录音，黄河人才网电话包括但不限于客服电话、销售电话等。</p>
                <p>8、您在黄河人才网发布的职位信息有有效期，黄河人才网有权下线有效期届满的职位信息。</p>
                <p>9、您购买或者黄河人才网赠送的线上服务和/或资源均有有效期，有效期结束后线上服务和/或资源自动清零、服务权限降低，资源有效期不可中断或延期，黄河人才网其他服务条款或优惠活动另有规定的除外。</p>
                <p>10、黄河人才网有权拒绝为与本单位经营同类业务、有业务竞争关系或者其他利害关系的单位及个人提供服务。</p>
                <p>11、用户同意以其注册的手机号码、电子邮箱接收黄河人才网发送的验证码、安全信息、商业广告。若希望“退订”商业广告，您按照短信、邮件中提示的方式正确操作后退订商业广告。</p>
                <p>
                    12、如需要注销的黄河人才网账户，您可以在黄河人才网APP上申请注销您的黄河人才网账户。在注销账户之后，我们将停止为您提供所有的产品和服务，并依据您的要求，删除您的个人信息，但法律法规另有规定的除外。</p>
                <p>13、您可以拨打我们的客户服务热线400-9988-911。</p>
                <h2>第3条 用户承诺</h2>
                <p>1、您应遵守中华人民共和国相关法律法规、所居住或者开展经营活动或者业务国家或者地区的法律法规，不得将我们的网络存储平台和/或服务用于非法目的，不也得以非法方式使用我们的网络存储平台和/或服务。</p>
                <p>2、您承诺在注册或者认证过程中，提供的资料合法、真实、有效。如提交的资料有任何变动，应该及时、准确更新。如因提交的资料不真实或者更新不及时而引发的问题，您应承担相应责任。</p>
                <p>
                    3、您承诺在黄河人才网上传、发表、转载或者传输的内容合法、真实、有效，不得夸张描述或编造虚假信息，并对内容承担全部责任。您不得在黄河人才网的任何页面发布、转载、传送含有下列任何内容的信息，否则黄河人才网有权不通知您自行采取措施，包括但不限于删除用户发布的内容，限制、暂停使用，或终止合作永久封禁账户等措施：</p>
                <p>（1）违反宪法确定的基本原则的；</p>
                <p>（2）危害国家安全，泄漏国家机密，颠覆国家政权，破坏国家统一的；</p>
                <p>（3）损害国家荣誉和利益的；</p>
                <p>（4）煽动民族仇恨、民族歧视，破坏民族团结的；</p>
                <p>（5）破坏国家宗教政策，宣扬邪教和封建迷信的；</p>
                <p>（6）散布谣言，扰乱社会秩序，破坏社会稳定的；</p>
                <p>（7）散布淫秽、色情、赌博、暴力、恐怖或者教唆犯罪的；</p>
                <p>（8）侮辱或者诽谤他人，侵害他人合法权益的；</p>
                <p>（9）煽动非法集会、结社、游行、示威、聚众扰乱社会秩序的；</p>
                <p>（10）含有歧视内容的，如民族歧视、地域歧视、性别歧视、宗教歧视等；</p>
                <p>（11）虚假、胁迫、猥亵、骚扰、中伤、粗俗、侵害他人隐私或其他有悖道德、令人反感的内容；</p>
                <p>（12）含有其他违法违规、违反《信用分规则》、《职位发布规则》、违背善良风俗内容的内容。</p>
                <h2>第4条 用户违规行为的处理</h2>
                <p>1、您如违反法律法规或本协议中的第二条、第三条任一条款的，黄河人才网有权要求改正或直接采取一切必要的措施。必要的措施包括但不限于删除用户张贴的内容、暂停或终止用户使用黄河人才网服务。</p>
                <p>2、招聘用户违反黄河人才网公布《信用分规则》、《职位发布规则》，根据对应规则进行处理。</p>
                <p>3、用户如违反法律法规或本协议约定，导致黄河人才网或其关联公司遭受损失（损失包括但不限于直接经济损失、行政罚款、维权成本），用户应赔偿黄河人才网或其关联公司的全部损失。</p>
                <p>4、黄河人才网未行使或延迟行使其在本协议权利并不构成对这些权利的放弃，单独或部分行使其在本协议项下的任何权利不妨碍任何其它权利的行使。黄河人才网随时有权要求用户继续履行义务并承担相应的违约责任。</p>
                <h2>第5条 用户的个人信息保护</h2>
                <p>我们重视对您的信息保护，具体详情请参阅《隐私政策》。</p>
                <h2>第6条 版权声明</h2>
                <p>我们平台特有的标识、版面设计、编排方式等知识产权均属黄河人才网享有，未经黄河人才网许可，不得任意复制、转载或使用。</p>
                <h2>第7条 不可抗力以及免责</h2>
                <p>
                    1、因遇不可抗力造成的黄河人才网无法为用户提供服务的，黄河人才网不承担任何法律责任，不可抗力包括但不限于：政府行为、自然灾害、战争、罢工、电脑病毒、黑客攻击、电信管理部门因技术调整导致网络中断等。</p>
                <p>
                    2、用户理解黄河人才网无法保证网络服务任何条件下均不会中断，故黄河人才网对网络服务的及时性、安全性、准确性不作担保。同时，黄河人才网对服务器受病毒侵袭及其他故障侵扰免责。用户应做好数据备份，若发生使用本平台时的数据丢失的情况，黄河人才网免责。</p>
                <p>3、黄河人才网不能保证某一招聘信息会有一定数量的用户来浏览，也不能保证会有一位特定的用户来浏览。黄河人才网并不保证所有信息、文本、图形、链接及其它项目的绝对准确性和完整性，故仅供用户参考使用。</p>
                <p>
                    4、用户承担通过黄河人才网登录到其他站点而形成的全部风险。同时了解通过黄河人才网之外与其他个人及用户的沟通不在黄河人才网控制范围内，其独立承担相应的后果。黄河人才网提供平台服务，故不担保用户发送给另一方用户的资料的真实性、精确性与可靠性。</p>
                <p>
                    5、黄河人才网提供平台服务，任何透过黄河人才网发布的招聘信息及其他产品或者服务均系用户自行发布，因其发布行为产生的法律后果由发布人承担；用户在通过黄河人才网得到资讯和信息后，与信息发布方所进行的任何交易均系其双方自主交易，双方若发生纠纷，皆与黄河人才网无关，黄河人才网不承担任何法律责任。</p>
                <h2>第8条 通知、送达</h2>
                <p>1、黄河人才网对于用户所有的通知均可通过【推送通知、电子邮件、短信、公告】，该等通知于发送之日视为已送达收件人。</p>
                <p>2、用户对于黄河人才网的通知应当通过黄河人才网如下正式公布的通信地址、电子邮件地址等联系信息进行送达。</p>
                <p>3、黄河人才网的联系信息</p>
                <p>地址：郑州市金水区农业路41号投资大厦</p>
                <p>电话：400-9988-911</p>
                <h2>第9条 法律适用、管辖与其他</h2>
                <p>1、本协议之订立、生效、解释、修订、补充、终止、执行与争议解决均适用中华人民共和国大陆地区法律；如法律无相关规定的，参照商业惯例及/或行业惯例。</p>
                <p>2、如双方就本协议内容或其执行发生任何争议，双方应尽量友好协商解决；协商不成时，任何一方均可向人民法院提起诉讼。</p>
                <p>3、本协议任一条款被视为废止、无效或不可执行，该条应视为可分的且并不影响本协议其余条款的有效性及可执行性。</p>
            </div>
        </el-dialog>
        <!-- 隐私政策 -->
        <el-dialog class="agreement" title="隐私政策" width="1000px" :visible.sync="privacyFlag" @close="privacyFlag=false">
            <div class="box">
                <p>
                    黄河人才网（以下统称“黄河人才”或“我们”）一向庄严承诺保护使用黄河人才及旗下所有产品服务（以下统称“黄河人才服务”）之用户（以下统称“用户”或“您”）的隐私。您在使用黄河人才服务时，我们可能会收集和使用您的相关信息。</p>
                <h2>
                    *本隐私条款为黄河人才服务声明的一部分，并适用于我们提供的一切黄河人才服务，其包括黄河人才及旗下所有产品服务的PC端、App端、H5手机网站以及提供基础服务的微信公众号、微信小程序。另外，若您通过使用第三方产品和/或服务（如第三方账号）来使用黄河人才服务，您的信息还应当适用该第三方的隐私政策。</h2>
                <h2>
                    *黄河人才将通过本隐私条款向您说明黄河人才会如何收集、保存、使用、共享以及保护您的信息，本隐私条款与您使用我们的服务关系密切，在使用黄河人才服务前，请您务必仔细阅读并透彻理解本政策，在确认充分理解并同意后使用相关产品服务。一旦您使用或在我们更新本隐私条款后（我们会及时提示您更新的情况）继续使用我们的产品或服务，即意味着您已充分理解并同意本隐私条款(含更新版本)内容，授权并接受我们按照本隐私条款的规定收集、保存、使用、共享、披露您的信息。如您不同意协议中的任何条款，您应立即停止访问黄河人才及使用相关服务。</h2>
                <p>您可以通过以下目录阅读相应章节，进一步了解本条款的具体内容</p>
                <p>1.我们收集的信息类型</p>
                <p>2.我们如何使用所收集的信息</p>
                <p>3.我们可能共享、转让、公开披露信息</p>
                <p>4.您的权利</p>
                <p>5.第三方网站</p>
                <p>6.我们如何保存和保护您的信息</p>
                <p>7.未成年人保护</p>
                <p>8.本《隐私条款》的变更</p>
                <p>9.联系我们</p>
                <p>1.我们收集的信息类型</p>
                <p>1.1您向我们提供的信息</p>
                <p>1.1.1使用黄河人才的必要信息</p>
                <p>
                    当您使用黄河人才时，我们要求您提供并收集以下您的个人信息。此等信息对于充分履行您和我们之间的约定的服务很有必要，并使得我们能够遵守我们的法律义务。没有此等信息，我们可能无法向您提供您所要求的全部服务。 </p>
                <h2>
                    *账号信息。在您使用黄河人才提供的服务时，可以在不注册账号或不登录的情形下浏览黄河人才网站，但您在注册之后可以享受更全面和优质的服务。在您注册黄河人才账号时，我们需要收集您的手机号码或个人邮箱，我们将通过发送短信验证码的方式来验证您的手机号码是否真实有效，通过发送邮件的方式来验证您的邮箱是否真实有效。您也可以使用微信和QQ的第三方账号关联登录，为保存登录信息并在不同设备登录时能同步数据，我们需要您授予我们从第三方账号获得某些信息的权限，如使用者第三方关联登录的唯一标识、头像、昵称。有关您在这些第三方账号中所有的隐私控制、选项及具体的隐私规定，请参阅他们的隐私政策。 </h2>
                <h2>
                    *简历资料和服务项目信息。为使用黄河人才的创建简历、投递简历功能时，我们可能会要求您补充个人基本信息包括姓名、性别、出生日期、手机号码、求职状态、开始工作年份、居住地。当您向平台上传附件简历或编辑在线简历，并选择了公开您的简历时，您已同意使用平台相应服务的招聘单位（及人员）可以通过我们的系统功能（如职位、行业、从业时间等关键词）发现您。购买了相应服务的招聘企业（及人员）拥有法律上许可的对您的简历进行查询、浏览、下载、使用、存储的权利；但是你仍然拥有通过设置功能，选择是否完全公开您的简历或屏蔽某些招聘企业发现您的信息的权利。对于因此而引起的任何法律纠纷（包括但不限于其他招聘企业或人员错误或非法使用前述简历信息），本平台不承担任何法律责任。</h2>
                <h2>*与黄河人才招聘管理系统中的招聘企业沟通（包括简历投递、人事来信等）。在您与招聘企业沟通，我们会收集您的沟通行为信息以及您选择提供的任何信息。</h2>
                <p>1.1.2您选择向我们提供的信息</p>
                <p>您可以选择向我们提供额外的个人信息，以便在使用黄河人才时获得更好的用户体验。此等额外信息将基于您的自愿同意而处理。</p>
                <h2>
                    *额外个人资料信息。您可选择提供额外个人资料信息，作为您简历的一部分。在个人信息类别中，您可以选择添加邮箱、证件类型、证件号、目前年收入、户口/国籍、婚姻状况、政治面貌；在教育经历类别中，您可以选择添加您过去的教育经历；在求职意向中，您可以选择添加您期望的工作地点、期望职能、期望职位、薪资类型、期望薪资、工作类型、期望行业、到岗时间、自我评价、个人标签；在工作经验类别中，您可以选择添加您的过去的工作经历；此外，您还可以自行选择填写您的项目经验、校内荣誉、校内职务、证书、技能/语言、培训经历，并上传相应附件。如您在账户设置中所示，部分此等个人信息是您公开个人资料页的一部分，当简历设为公开或您通过黄河人才主动投递简历给招聘企业时，此等信息将向招聘企业公开（黄河人才为您的简历提供三种控制权限，当您在填写简历时就可以设置个人简历控制权限）。简历的三种控制权限为：</h2>
                <p>（1）完全公开。允许黄河人才的专业人员和通过黄河人才审核的招聘企业有权使用我们的简历库搜索到您的简历。如果您希望得到最全面的求职服务——职位推荐、面试邀约、求职秘籍等，这项服务将更适合您。</p>
                <p>
                    （2）无忧公开。只允许黄河人才的专业人员或认证猎头人士使用我们的简历库搜索到您的简历。我们会根据您的工作经历来为您推荐高质量的职位。黄河人才也会不定期的与您联系，届时会与您确认您的最新求职意向并为您提供更多符合您的职业发展机会。</p>
                <p>
                    （3）完全保密。您可以在黄河人才上填写简历，并自行查找职位和投递简历。您的个人信息不会被任何人员（包括并不限于黄河人才的专业人员、招聘企业）搜索到，所有的信息完全保密。但如果您希望能接受面试邀约或职位推荐，我们建议您更改此选项，将简历公开度设定为“完全公开”。</p>
                <h2>
                    *个性化信息。如果您选择我们为您提供的个性化产品或服务，我们会根据企业招聘工作的具体需求，要求您提供更多个性化信息。当您使用我们的校园招聘产品服务时，根据企业校园招聘的具体需求，校招简历还会要求您提供身份证号，用于笔试、面试、政审等环节。当您使用我们的社招定制化简历服务时，根据企业社会招聘的具体需求，我们可能需要您提供家庭成员和社会关系、本人身高、体重、健康状况和照片等，用于满足企业定制化需求。如果您不根据要求提供必填项的个性化信息，可能会影响到您使用个性化的产品或服务，但不会影响您使用除本个性化产品或服务外的黄河人才其他服务。</h2>
                <h2>
                    *授权信息。在您使用黄河人才的部分功能和/或服务时可能需要您自行开启以下权限。您决定开启这些权限即代表您授权我们可以收集和使用这些信息来实现相关功能。不开启或关闭这些权限即代表您取消了这些授权，则我们将不再继续收集和使用您的这些个人信息，也无法为您继续提供与这些权限相对应的功能。您关闭权限的决定不会影响此前基于您的授权所进行的个人信息处理。这些权限包括但不限于：</h2>
                <p>（1）文件存储和访问权限：开启文件存储和访问权限，方便为您提供保存图片、缓存播放视频功能。</p>
                <p>
                    （2）访问位置信息权限：开启访问位置信息权限，方便为您提供当前城市的工作、推荐附件工作、填写简历信息相关地址等功能。我们可能会收集您的精确或大致位置信息，此等信息通过您的IP地址或移动设备的GPS数据来确定，以便为您提供更好的用户体验。即使当您不使用应用时，如果您的设置或设备权限允许此等连接开启，我们仍可能会收集此等信息。在您未授权访问位置信息时，我们将默认展示上海的职位相关信息。</p>
                <p>（3）相机权限：开启相机权限，方便您直接拍摄照片作为简历头像，拍摄照片发送给招聘官，反馈意见时可以拍摄图片上传、实名认证人脸识别和在线面试时与面试官视频等功能的使用。</p>
                <p>（4）访问和修改日历权限：开启访问和修改日历权限，方便您将宣讲会日期、在线面试日期加入您的日历提醒中，防止遗忘。</p>
                <p>（5）麦克风权限：开启麦克风权限，方便您使用在线面试时可以直接与面试官语音聊天等功能。</p>
                <h2>
                    *其他信息。您还可以选择在进行搜索、更新或回答调查、在社区论坛发布内容、参与活动或使用黄河人才的其他功能时，向我们提供其他信息（另，黄河人才为访问者提供论坛、BBS等。如果您访问这些区域，您发布的任何信息都会成为公共信息。您在这些区域发表言论及/或发布信息都属个人行为，不代表黄河人才的立场，黄河人才不对此类个人言论及个人行为承担任何责任）。这些信息包括但不限于：</h2>
                <p>
                    （1）客服功能：当您在黄河人才使用客服功能时，为了方便与您联系或帮助您解决问题，我们可能需要您提供姓名、手机号码、电子邮件、简历、证件号码信息。同时，我们可能会利用您认证后的联系信息与您直接沟通或互动，联系信息包括您的手机号码、电子邮件。为保证您的账号安全，客服在接受您的咨询时，会使用您的账号信息核验您的身份。如您拒绝提供上述信息，可能部分功能无法使用，同时无法向您及时反馈咨询结果。您在使用服务的过程中，可能会向客服渠道提出任何问题、意见、建议、投诉、举报等需求。为此我们需收集、使用上述信息中的（部分/全部）相关内容。有关向第三方披露、共享您的个人信息的情况，将遵循下文中的具体约定。</p>
                <p>
                    （2）参与活动：当您参加到我们举办的专题活动、社区论坛或要购买公开的产品和服务时，除用户基本信息外，我们还可能收集您的个人照片及其所发布的言论、文章等。您在使用上述社交互动服务时，您应当知晓您提交的任何信息，包括您的姓名、邮箱地址，均有可能被他人获知，请您谨慎考虑披露您的相关个人敏感信息。</p>
                <p>（3）问卷调研：为了向您提供更好的服务和网络使用环境，我们可能会发起问卷调研以了解您的使用偏好、相关意见。您可以自主选择是否参加问卷调研，调研结果将仅供统计使用。</p>
                <p>
                    （4）反馈：我们可以通过黄河人才网站接受您所提供的反馈信息。通过此类链接收到的反馈信息的全部相关权利（包括但不限于复制、转引该等信息的权利）属于我们所有。由于反馈信息有您主动提供，因此视为您已同意我们获取并在合法范围内使用此类反馈信息。我们可能通过您所提供的联系方式与您联系并进一步获得相关反馈信息。</p>
                <p>1.2您使用黄河人才服务时，我们自动收集的信息</p>
                <p>在您使用黄河人才服务时，我们会自动收集关于您所使用的服务以及如何使用相关服务的信息，包括个人信息。</p>
                <p>1.2.1使用信息。我们会收集您与黄河人才的互动信息，如您查看的页面或其他内容、您搜索的服务项目以及您在黄河人才上的其他活动，这些活动包括但不限于：</p>
                <p>
                    （1）线上支付：在您选择购买我们的服务时，我们会根据法律规定记录、保存在黄河人才上的服务信息、交易信息。您可以选择第三方支付机构所提供的支付服务，根据您的选择，您需要提供开户行、账户、银行账户或者您选择的第三方支付时必要信息。如果需要发票，您还需要提交纳税人识别号，支付功能本身并不收集您的信息，但我们需要将您的订单号与交易金额信息与支付机构共享以实现其确认您的支付指令并完成支付。</p>
                <p>
                    （2）搜索订阅：当您使用黄河人才提供的搜索、订阅功能时，为了给您带来更便捷的搜索服务并不断完善黄河人才产品和/或服务，我们会收集您查询的关键字信息以及您在使用黄河人才服务时所浏览或要求信息和内容详情。</p>
                <p>（3）沟通功能：我们向您和对您感兴趣的招聘单位提供了线上沟通、语音面试和视频面试功能。为响应维护网络秩序和防欺诈的要求，我们会在事先征求您的同意后收集您与招聘单位之间的语音记录、视频记录。</p>
                <p>
                    （4）关注并使用黄河人才微信公众号、小程序：当您关注、使用我们的微信公众号时，我们会收集您的微信昵称、头像；当您使用该微信小程序时，我们可能会收集您的微信UnionID、OpenID、UserID、微信昵称、微信头像、登录记录信息。当您使用微信账号或微信小程序的特定功能或服务时，您可能需要注册、登录黄河人才账号或使用微信账号授权登录，当您选择后者时，我们可能会收集您的手机号码，对于此类消息，我们将按照微信公众号和微信小程序的个人信息收集规则，根据相应提示获取您的同意。当您参加线上课程等活动时，我们将收集您主动填写的个人信息，且仅用于该次活动的开展和统计工作。</p>
                <p>
                    1.2.2登录数据和设备信息。为了保障您使用黄河人才的人身、财产安全，更好地预防求职诈骗财产风险、人身安全风险，以及更准确地识别违反法律法规及黄河人才相关协议、规则的行为，我们会记录、整合、使用您的常用设备信息、网络标识信息，以及我们关联公司、合作第三方取得您授权或依法共享的信息。即使您未创建或登录黄河人才账户，当您访问并使用黄河人才网站时，我们也会自动收集登录数据和设备信息。此等信息包括：您使用黄河人才（包括指向第三方应用的链接）的详细信息、IP地址、访问日期和次数、硬件和软件信息、设备信息，设备事件信息、唯一识别符、崩溃数据、cookie数据以及您在使用黄河人才前后查看或接触过的页面。收集此等信息用于判断您的账号风险、进行身份验证、检测我们认为存在风险的行为以及防范平台安全时间，并采取必要的记录、审计、分析、处置措施。</p>
                <p>
                    1.2.3Cookie及类似技术。我们使用Cookie及类似技术，如网络信标、像素及移动标识符。借助于Cookie，网站能够存储您的偏好等数据。我们不会将Cookie用于本政策所述目的之外的任何用途，您可根据自己的偏好管理或删除Cookie。（1）您有权选择接受或拒绝接受Cookie。在您未拒绝接受Cookie的情况下，黄河人才.com会在您的计算机上设定或取用Cookie，以便您能登录或使用依赖于Cookie的黄河人才.com平台服务或功能。同时，黄河人才.com将自动接收并记录您的浏览器端数据，包括但不限于IP地址、网站Cookie中的资料及您要求取用的网页记录；（2）您可以通过修改浏览器设置的方式拒绝接受Cookie。但如果您选择拒绝接受Cookie，则您可能无法登录或使用依赖于Cookie的黄河人才.com平台服务或功能；（3）通过黄河人才.com所设Cookie所取得的有关信息，将适用本政策。</p>
                <h2>
                    *网站信标和像素标签。除Cookie外，我们还会在网站上使用网站信标和像素标签等其他同类技术。例如，我们向您发送的电子邮件可能含有链接至我们网站内容的点击URL。如果您点击该链接，我们则会跟踪此次点击，帮助我们了解您的产品或服务偏好并改善客户服务。网站信标通常是一种嵌入到网站或电子邮件中的透明图像。借助于电子邮件中的像素标签，我们能够获知电子邮件是否被打开。如果您不希望自己的活动以这种方式被追踪，则可以随时从我们的寄信名单中退订。</h2>
                <p>
                    *我们还可能允许我们的商业合作伙伴在黄河人才上使用这些跟踪技术，或让其他人代我们跟踪您的行为，以提供更好的服务和用户体验。例如，我们聘请来提供第三方数据统计和分析服务的公司可能需要采集和访问个人数据以进行数据统计和分析。对我们与之共享个人信息的公司、组织和个人，我们会与其签署严格的保密协定，要求他们按照我们的说明、本隐私条款以及其他任何相关的保密和安全措施来处理个人信息。</p>
                <p>1.3我们通过第三方收集的信息</p>
                <p>
                    黄河人才可能会收集其他方在使用黄河人才服务时提供的关于您的信息（包括个人信息），或从其他渠道获取信息，并与我们通过黄河人才服务收集的信息整合。我们不会控制、监督或回应提供您的信息的第三方如何处理您的个人数据，任何发给我们的关于披露您的个人信息的信息请求应直接发送给此类第三方。</p>
                <h2>
                    *第三方服务。我们提供部分功能和/或服务时需要使用第三方SDK技术，这些第三方SDK在配合我们向您提供更全面的服务的同时，可能会收集或使用您的个人信息，我们会以弹窗提示等方式明确告知您，在您授权同意后再获取相关信息，相关隐私实践请详见该第三方的隐私政策。如未取得您的授权，我们将不会收集和使用相关信息，也不会再反复弹窗向您获取授权。目前这些SDK包括：</h2>
                <p>
                    （1）第三方登录（新浪微博SDK、微信SDK、QQ登录SDK）：如果您将您的黄河人才账户与第三方服务相关联或使用第三方服务登录您的黄河人才账户，相关第三方服务可能会向我们发送您在该服务中的注册信息和个人资料信息。信息因服务而异，由相关服务控制或由您通过相关服务的隐私设置授权。使用第三方登录功能和一键快速登录功能时，在您授权同意后，新浪微博登录SDK、微信SDK、QQ登录SDK可能获取访问您的读写入外部存储、WiFi权限、网络状态、电话状态、检索正在运行的应用，用于保证对应功能的正常使用。</p>
                <p>
                    （2）支付（支付宝、微信SDK）:为实现用户在线支付购买增值服务产品，在您授权同意后，微信、支付宝SDK可能获取访问您的网络状态、读取电话状态、Wi-Fi状态，确保您在服务中正常使用在线支付的功能。您可选择关闭相应的授权，但可能造成您无法购买我们的增值产品或服务。</p>
                <p>
                    （3）定位（高德地图SDK）:为了确保求职者获取招聘单位的准确地址，在您授权同意后，高德地图SDK可能获取访问您所在的城市、地区以及位置信息、网络状态、读写外部存储权限、Wi-Fi状态。您可选择关闭相应的授权，但可能造成您无法接收附近的职位信息。</p>
                <p>
                    （4）分享（微信、QQ、新浪微博SDK）：为了实现分享到第三方的功能，在您授权同意后，微信SDK、QQSDK、新浪微博SDK可能获取访问您的读写入外部存储、WiFi权限、网络状态、电话状态，用于保证对应功能的正常使用。</p>
                <p>
                    （5）PushSDK（极光推送、华为推送、小米推送）：为了向您推送系统通知或重要消息，在您授权同意后，PushSDK可能获取读写外部存储、查看WiFi状态、查看电话状态、查看网络连接，检索正在运行的应用，如果您不希望收到这些通知或信息，可以在终端设备设置中关闭消息通知。</p>
                <h2>
                    *其他来源。在适用法律允许的情况下，我们可以从第三方服务提供商和/或合作伙伴处获得您的额外信息，并将此类信息与我们所拥有的您的信息整合。我们可以通过合作伙伴获得您的信息以及您在黄河人才内外的活动信息，或您在合作伙伴广告网络的体验与互动信息。</h2>
                <p>2.我们如何使用所收集的信息</p>
                <p>
                    我们遵循“合法、正当、必要”的原则使用、存储和处理您的信息（包括个人信息），以提供、了解、改进和发展黄河人才，创建和维护一个受到信任的、更安全的环境，并遵守我们的法律义务。其中，如涉及您的个人化信息，我们将通过技术手段对数据进行去标识化处理，去标识化处理的信息将无法识别主体。我们有权使用已经去标识化的信息；并在不透露您个人信息的前提下，对用户数据库进行分析、利用。</p>
                <p>2.1改进和发展黄河人才，为您提供更好的服务。</p>
                <h2>*使您可以使用黄河人才，并通过黄河人才与招聘企业获得联系。</h2>
                <h2>*运营、保护、改进和优化黄河人才，如开展分析和研究。</h2>
                <h2>*向您发送服务或支持信息，如隐私条款更新、人事来信、活动通知等。</h2>
                <h2>
                    *运营、保护、改进和优化黄河人才为您提供个性化与定制化体验（如相关职位推荐）。根据您与黄河人才的互动、您的搜索与投递简历行为、您的个人资料信息和求职意向，以及您向黄河人才提交的其他内容，我们会进行行为分析。</h2>
                <p>2.2创建和维护一个受到信任的以及更安全的环境</p>
                <h2>*检测和预防欺诈、滥用、安全事件及其他有害活动。</h2>
                <h2>*开展安全调查和风险评估。</h2>
                <h2>*对照数据库与其他信息源进行检查，包括在适用法律允许的限度内以及必要时经您同意进行背景或警方调查。</h2>
                <h2>*遵守我们的法律义务。</h2>
                <h2>*执行我们的服务条款及其他政策。</h2>
                <p>2.3提供个性化定制、评估和改进我们的广告和营销</p>
                <h2>
                    *根据您的求职意向、搜索行为等信息偏好（基于您提供给我们的简历信息、您与黄河人才的互动、从第三方获得信息以及您的搜索和其他记录）进行行为分析，向您发送短信、邮件、App推送、微信和电话邀约等营销内容、广告以及您可能感兴趣的其他信息（包括与黄河人才、合作伙伴活动及服务相关的信息）。如果您不需要上述服务，您可以关闭推送功能。在51JobApp内通过“我的”-“设置”-“系统设置”中，开启或关闭“推送通知”。对于邮件推送信息，您可以点击邮件中的“取消订阅”或“这里退订”按钮以实施邮件退订，不同版本的邮箱的按钮名称可能略有差异。对于短信的推送信息，您可以根据短信内容提示退订服务。</h2>
                <h2>
                    *为给您提供更多您可能感兴趣的信息（包括投递邀请、面试提醒、推荐职位/企业、企业校园招聘宣讲会、企业开放日活动等等），我们可能会通过电话提醒、电话邀约或发送短信方式通知您关于简历投递、面试、职位、公司、以及线下招聘活动等信息。如果您不想接受我们以任何方式向您提供的营销信息，您可以选择收回您的授权同意。您可以通过我们在电子邮件中的退订按钮或按照我们在短信中提供的退订说明进行退订，您也可以通过本隐私条款中提供的联系方式与我们联系。需要说明的是，即使您选择拒绝接受推广信息，我们可能还会向您发送重要的系统管理及安全信息。</h2>
                <h2>*个性化定制、评估和改进们的广告。</h2>
                <h2>*管理推荐计划、奖励、调查、抽奖、竞赛，或由黄河人才或我们的第三方业务伙伴主办或管理的其他活动或事件。</h2>
                <h2>*鉴于我们有合法利益开展营销活动，为您提供您感兴趣的产品或服务，我们将根据本条列出的目的处理您的个人信息。</h2>
                <p>3.我们可能共享、转让、公开披露信息</p>
                <p>
                    3.1获得您的明确同意后，我们会与其他方共享您的个人信息。比如：当您主动投递简历给招聘企业，或您设置简历为“公开”时，您的简历信息将分享给企业用户（即招聘企业），包括您在简历中主动填写的所有内容。</p>
                <p>3.2为便于我们基于关联账号共同向您提供服务，推荐您可能感兴趣的信息或保护黄河人才关联公司或其他用户或公众的人身财产安全免遭侵害，您的个人信息可能会与我们的关联公司共享。</p>
                <p>
                    3.3仅为实现本隐私权政策中声明的目的，我们的某些服务将由我们和授权合作伙伴共同提供。我们仅会出于合法、正当、必要、特定、明确的目的共享您的个人信息，并且只会共享提供服务所必要的个人信息，以提供更好的客户服务和用户体验。我们的合作伙伴必须遵守我们的数据隐私和安全要求，并且无权将共享的个人信息用于与产品或服务无关的其他用途。</p>
                <p>
                    3.4在黄河人才服务提供者发生合并、收购或破产清算情形，或其他涉及合并、收购或破产清算情形时，如涉及到个人信息转让，我们会要求新的持有您个人信息的公司、组织继续受本政策的约束，否则我们将要求该公司、组织和个人重新向您征求授权同意。</p>
                <p>3.5尤其注意：以下情形中，共享、转让、公开披露您的个人信息无需事先征得您的授权同意：</p>
                <p>3.5.1依照法律、法规、法院命令、监管机构命令的要求，或根据政府行为、监管要求或请求；</p>
                <p>3.5.2为执行相关服务协议或本政策、维护社会公共利益，为保护使用者、我们的客户、我们或我们的关联公司、其他用户或雇员的人身财产安全或其他合法权益合理且必要的用途；</p>
                <p>
                    3.5.3为提供和优化我们的服务，我们的服务中内嵌了第三方的SDK，比如：您在求职中需要确定招聘单位的地理位置，可以调用百度地图的定位和导航功能。在您调用相关功能时，第三方SDK可能与我们收集您的个人常用设备信息（硬件序列号、设备MAC地址、唯一设备识别码）、网络身份标识信息和其他可识别的信息，上述所有信息将去标识化传输。</p>
                <p>4.您的权利</p>
                <p>在您使用黄河人才服务期间，为了您可以更加方便地访问和管理您的信息，同时保障您对于自己信息更正、删除以及撤销同意的权利，我们在相关页面中为您提供了相应的操作设置，您可以参考下面的指引进行操作。</p>
                <p>4.1管理您的信息</p>
                <p>除法律规定外，您有权访问和管理您的信息。我们鼓励您更新和修改您的信息以使其更准确有效。如果您想行使数据管理权，可以通过以下方式自行访问：</p>
                <p>（1）黄河人才网站</p>
                <p>a.您的个人资料信息：您登录黄河人才官方网站后可以通过黄河人才首页右上方“个人用户名称”-“我的黄河人才”，访问、管理您的账户信息。</p>
                <p>b.您的账号安全信息：您登录黄河人才官方网站后可以通过黄河人才首页右上方“个人用户名称”-“我的黄河人才”-“安全中心”，访问、管理您的登录密码、认证手机、认证邮箱、第三方账号的信息。</p>
                <p>c.您的简历信息：您登录黄河人才官方网站后可以通过黄河人才首页右上方“个人用户名称”-“简历中心”，访问、管理您的简历信息，对您的简历进行编辑调整。</p>
                <p>
                    d.您的账号隐私信息：您登录黄河人才官方网站后可以通过黄河人才首页右上方“个人用户名称”进入个人中心，在个人中心左侧功能区设置您的账号隐私信息，通过“简历中心”设置简历的公开程度，通过“更多”-“屏蔽公司“设置不让某些公司看你的简历。</p>
                <p>4.2更正不准确或不完整的信息</p>
                <p>
                    您在账户内可修改您的原有个人信息设置，包括但不限于个人简历、订阅信息、收藏的职位和关注的公司。当您发现我们处理的关于您的个人信息有错误且您无法在账户内自行修改时，您有权通过“联系我们“要求我们更正您的不准确或不完整的个人信息。</p>
                <p>4.3数据保留与删除</p>
                <p>
                    通常，我们只在履行您与我们之间的约定的服务并遵守我们的法律义务的必要时间段内保留您的不可识别个人信息。如果您不再希望我们使用您的信息来为您提供黄河人才服务，您可以在简历设置中自主修改、删除您的个人信息，您也可以通过“联系我们“要求我们删除您的个人信息并关闭您的黄河人才服务。请注意，如果您申请删除您的个人信息：</p>
                <h2>
                    *出于欺诈侦测和预防以及提高安全性的目的，我们可能会保留您的不可识别个人信息，以符合我们的合法商业利益。如果因欺诈或安全原因停用了黄河人才服务，则我们可能会保留该黄河人才账户的不可识别个人信息，以防止该用户将来再次创建新的黄河人才账户。</h2>
                <h2>*为了遵守我们的法律义务，我们可能会保留并使用您的不可识别个人信息。例如，黄河人才可能会为税务、法律报告及审计义务之目的保留您的不可识别个人信息。</h2>
                <h2>
                    *即使您的黄河人才账户被注销，您与他人分享的信息（如论坛帖子）仍可能公开显示，但您对这些信息的归属信息将被删除。此外，您的信息的某些副本（如登录记录）可能会保留在我们的数据库中，但会与个人标识符区分开来。</h2>
                <h2>
                    *由于我们会维护黄河人才服务以防止意外或恶意的损失和破坏，您的个人信息的残留副本可能不会在有限的时间内从我们的备份系统中删除，我们将安全地存储您的个人信息并将其与任何进一步处理隔离，直到备份可以清除或实现匿名。</h2>
                <h2>*为防止错误操作导致信息丢失，当您删除您最后一份简历时，您需要联系客服进行处理，当我们决定响应您的删除请求时，我们将尽快从黄河人才服务中删除信息，使您的信息不可见。</h2>
                <p>4.4撤销同意和处理限制</p>
                <p>
                    如果您已同意黄河人才处理您的个人信息，您可以随时通过登录黄河人才App，进入“我的“-”设置“-“系统设置”-“权限设置”或通过手机设备功能逐项查看具体的个人信息访问权限及其开启状态，并决定开启或关闭这些权限来改变您授权我们收集信息的范围或撤回您的授权。当您撤销同意或授权后，我们将不再处理相应的信息，但请您理解，当您撤销同意或授权后，我们无法继续为您提供撤销同意或授权所对应的全部或部分功能和服务。您也可以通过“联系我们“向黄河人才发送消息来撤销您的同意，同时说明您要撤销哪一项同意。请注意，撤销您的同意不会影响任何在此撤销之前依据此类同意的处理活动的合法性。</p>
                <h2>
                    *请您理解，在您访问、修改和删除相关信息时，我们可能会要求您进行身份验证，以保障账号的安全。同时，由于技术所限、法律或监管要求，我们可能无法满足您的所有要求，原则上我们会在15天内答复您的请求。</h2>
                <p>4.5注销权</p>
                <p>
                    一般情况下，您可以通过网上自助或联系客服方式，注销您此前注册的账号，我们将尽快删除该账号。账户注销可能会导致清除您的所有用户数据和账户信息且不可恢复；但在特定的情形下，如合理必要地履行我们的法律义务、解决争议、防止欺诈和滥用，我们将在您的账号注销后保留不可识别个人的信息。如果您在操作中遇到无法注销的情况，可能的原因包括但不限于如下：（1）待注销账号近2个月内有投递；（2）待注销帐号内存在有效的增值服务；（3）注销帐号需要手机号验证身份，该“手机号”在近30日内重复做过注销帐号验证。具体无法注销的原因可以联系我们客服获取详情。</p>
                <p>
                    您可根据以下“联系我们”部分所列的方式与我们联络，以行使上述权利；或者对于通过黄河人才网站和黄河人才App收集的个人信息，您可通过黄河人才网站或App中的帮助与反馈功能提交相关权利要求。当您请求行使上述权利，或进行其他申诉时，原则上我们将于15天内回复处理意见或结果。</p>
                <p>4.6依据相关法律法规及国家相关标准，在以下情形中，我们可能无法响应您的请求：</p>
                <p>（1）与国家安全、国防安全直接相关的；</p>
                <p>（2）与公共安全、公共卫生、重大公共利益直接相关的；</p>
                <p>（3）与犯罪侦查、起诉、审判和执行判决等直接相关的；</p>
                <p>（4）有充分证据表明您存在主观恶意或滥用权利的；</p>
                <p>（5）响应您的请求将导致其他个人、组织的合法权益受到严重损害的；</p>
                <p>（6）涉及商业秘密的。</p>
                <p>5.第三方网站</p>
                <p>
                    我们的网站中可能包含第三方运营网站的链接。对于与黄河人才网站链接或黄河人才网站包含的第三方运营网站的相关产品或服务，需受他们的隐私政策约束，但这并不意味着黄河人才认可或负责该第三方运营网站的隐私政策。此外，我们的网站中还存在网络110报警服务，以响应您的紧急安全请求。</p>
                <p>6.我们如何保存和保护您的信息</p>
                <p>我们高度重视您的信息安全，我们将严格遵守相关法律法规规定，采取业内认可的合理可行的措施，保存和保护您的信息。防止信息遭到未经授权的访问、披露、使用、修改，避免信息损坏或丢失。</p>
                <p>6.1保存期限</p>
                <p>
                    我们仅为实现本隐私条款的目的所需的期限和法律法规及监管规定的最短时限内，保留您的信息，超出上述期限后，我们将删除您的个人信息或对您的个人信息进行匿名化处理。但如出现下列情况下，我们将更改信息的存储时间：</p>
                <p>（1）法律法规等有关规定的要求；</p>
                <p>（2）法院判决、裁定或其他法律程序规定的要求；</p>
                <p>（3）相关行政机关的强制要求；</p>
                <p>（4）我们有理由确信需要遵守法律法规等有关规定；</p>
                <p>（5）为执行相关服务协议或本隐私条款、维护社会公共利益，为保护们的客户、我们或我们的关联公司、其他用户或雇员的人身财产安全或其他合法权益所合理必需的用途；</p>
                <p>（6）当我们的产品或服务发生停止运营的情形时，我们将采取例如邮件、信函、电话、推送通知、公告等形式通知您，并在合理的期限内删除或匿名化处理您的信息。</p>
                <p>6.2保存地域</p>
                <p>我们在中华人民共和国境内运营中收集和产生的个人信息，存储在中国境内，以下情形除外：</p>
                <p>（1）法律法规有明确规定；</p>
                <p>（2）获得您的明确授权；</p>
                <p>（3）您通过互联网进行个人主动投递等行为。通过黄河人才开展服务的企业包含大量跨国企业公司，上述公司可能在境外使用黄河人才服务，或将您的简历传输境外总部，具体实践请见各招聘企业的隐私政策。</p>
                <p>针对以上情形，我们会确保依据本隐私条款对您的个人信息提供足够的保护。</p>
                <p>6.3技术措施与数据安全措施</p>
                <p>（1）我们努力采取各种合理可行的措施来保护您的信息安全。我们积极建立数据分类分级制度、数据安全管理规范、数据安全开发规范来管理规范信息的存储和使用，确保未收集与我们提供的服务无关的信息。</p>
                <p>（2）我们通过与信息接触者签署保密协议、监控和审计机制来对数据进行全面安全控制。防止您的信息遭到未经授权的访问、公开披露、使用、修改、损坏或丢失。</p>
                <p>
                    （3）我们已使用符合业界标准的安全防护措施保护您提供的信息，防止数据遭到未经授权的访问、公开披露、使用、修改，防止数据发生损坏或丢失。我们会采取一切合理可行的措施，保护您的信息。例如，在您的浏览器与服务之间交换数据时受SSL加密保护；我们同时对黄河人才网站提供https安全浏览方式；我们会使用加密技术确保数据的保密性；我们会使用受信赖的保护机制防止数据遭到恶意攻击；我们会部署访问控制机制，确保只有授权人员才可以访问信息；以及我们会举办安全和隐私保护培训课程，加强员工对于保护信息重要性的认识。</p>
                <p>6.4安全认证</p>
                <p>我们已通过了公安机关的信息系统安全等级保护第三级备案，并与监管机构建立了良好的协调沟通机制，及时抵御并处置各类信息安全威胁，为您的信息安全提供全方位保障。</p>
                <p>6.5安全事件通知</p>
                <p>
                    我们会制定网络安全事件应急预案，及时处置系统漏洞、计算机病毒、网络攻击、网络侵入等安全风险，在发生危害网络安全的事件时，我们会立即启动应急预案，采取相应的补救措施，并按照适用法律及法规向有关主管部门报告。</p>
                <p>
                    在发生安全事件后，我们将按照法律法规的要求，及时向您告知安全事件的基本情况和可能的影响、我们已采取或将要采取的处理措施、您可自主防范和降低的风险的建议、对您的补救措施等。我们将及时将事件相关情况以短信通知、电话、邮件等您预留的联系方式告知您，难以逐一告知时我们会采取合理、有效的方式发布公告。</p>
                <p>7.未成年人保护</p>
                <p>
                    除了适用法律要求外，我们不会在明知的情况下收集未成年人（未满十八周岁）的个人信息。我们将在信息收集的相关功能中对年龄进行限定，不再提供十八周岁以下的年龄区间选项。十六周岁至十八周岁的未成年人使用黄河人才服务，应当由监护人仔细阅读本隐私条款、注册账户和填写相关信息，并应确保已征得其监护人同意的前提下使用我们的产品和服务并向我们提供您的信息。如未经其监护人同意，未成年人请勿向我们提供个人信息。如您的监护人不同意您按照本隐私条款使用我们的产品和服务并向我们提供信息，请您立即终止使用我们的服务并及时通知我们，以便我们采取相应的措施。如果监护人发现我们对您所监护的未成年人的信息处理有任何疑问，请通过本隐私条款公布的联系方式及时联系我们。我们将根据国家相关法律法规及本隐私条款的规定重点保护未成年人信息的保密性及安全性。</p>
                <p>8.本《隐私条款》的变更</p>
                <p>
                    黄河人才保留随时根据本条规定修改本《隐私条款》的权利。如果我们对本《隐私条款》做出变更，我们将发布变更后的《隐私条款》，并更新《隐私条款》顶端的“最后更新”日期。由于黄河人才的用户较多，如本政策发生更新，我们将以App推送通知或者在黄河人才官方网站发布公告的方式来通知您。为了您能及时接收到通知，建议您在联系方式更新时及时通知我们。如果您不同意变更后的《隐私条款》，您可以注销您的账户。如果您未在变更后的《隐私条款》生效前注销您的账户，您对黄河人才的继续访问或使用将受变更后的《隐私条款》的约束。</p>
                <p>9.联系我们</p>
                <p>公司名称：河南汇融人力资源管理有限公司</p>
                <p>注册地址：郑州市金水区农业路41号投资大厦2207房间</p>
                <p>联系方式：如果您对本《隐私条款》或黄河人才的信息处理方法有任何疑问、意见、建议以及申诉，您可以通过产品的帮助与反馈功能或如下方式同我们联系：</p>
                <p>电话：400-9988-911（工作日9：00-18：00）</p>
                <p>邮箱：zhaopin@hnichr.com</p>
                <p>
                    为了核查您的问题并及时向您反馈，我们可能需要您提交身份证明、有效联系方式和书面请求及相关证据。我们会妥善处理并及时反馈您的疑问、意见、8建议以及申诉，一般情况下，我们会在15天内对您的请求予以答复。</p>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import '@/util/jsencrypt.min.js';
import {
    getRandomImage,
    getSmsCode,
    getSmsCodeToken,
    login,
    personInfo,
    resumeList,
    wxLogin_check,
    wxLogin_setToken
} from '@/api/api'
import dragVerify from "vue-drag-verify2";
import QRCode from 'qrcodejs2'

import Vue from "vue"; // 引入qrcode
export default {
    //组件注入
    components: {dragVerify, QRCode},
    //存放数据
    data() {
        //滑块验证校验方法
        var passcall = (rule, value, callback) => {
            if (this.isPassingFlag == false) {
                return callback(new Error('请拖动滑块进行验证'));
            } else {
                callback();
            }
        };
        //同意协议校验方法
        var agree = (rule, value, callback) => {
            if (this.agreeFlag == false) {
                return callback(new Error('请阅读并同意用户协议和隐私政策'));
            } else {
                callback();
            }
        };
        return {
            back: false,//返回上一页
            randomImg: '',
            form: {
                phone: '',//手机号
                code: '',//验证码
                loginMode: 1,
                checkKey: '',
                'roleType': '0',
            },
            isPassingFlag: false,//默认滑块验证状态
            agreeFlag: false,//同意隐私
            codeName: '获取验证码',
            disabledFlag: false,//获取验证码能否点击
            time: 60,
            rules: {
                phone: [
                    {required: true, message: '请输入手机号码', trigger: 'blur'},
                    {validator: this.$telText, trigger: 'blur'},
                ],
                username: [
                    {required: true, message: '请输入手机号码', trigger: 'blur'},
                    {validator: this.$telText, trigger: 'blur'}
                ],
                password: [
                    {required: true, message: '请输入登录密码', trigger: 'blur'},
                ],
                captcha: [
                    {required: true, message: '请输入验证码', trigger: 'blur'}
                ],
                dragVerify: [
                    {validator: passcall, trigger: 'blur'},
                ],
                code: [
                    {required: true, message: '请输入验证码', trigger: 'blur'},
                ],
                agree: [
                    {validator: agree, trigger: 'blur'},
                ],
            },
            agreementFlag: false,
            privacyFlag: false,
            wechatLoginFlag: false,//微信快速登录
            overdue: false,//二维码是否过期
            overdueTimeout: 1000 * 60 * 5,//秒 5分钟（1000*60*5）
            qrcodeState: 0,
            timeoutId: 0,
            wxLoginToken: '',
        }
    },

    //接受父组件传递的值
    props: [],
    //监控data中的数据变化
    watch: {},
    //方法集合
    methods: {
        /**
         * 获取验证码
         */
        getRandomImage() {
            const time = new Date().getTime()
            this.form.checkKey = time
            getRandomImage({time: time}).then(res => {
                this.randomImg = res.result
            })
        },
        // 登录方式
        changeLoginMode(mode) {
            this.form.loginMode = mode
            if (mode == 2) {
                this.getRandomImage()
            }
            this.$refs.form.resetFields();
        },
        //微信快速登录
        wechatLoginPop() {
            this.wechatLoginFlag = !this.wechatLoginFlag
            if (this.wechatLoginFlag) {
                wxLogin_setToken({}).then(res => {
                    if (res.code == 200) {
                        //alert(res.message)
                        console.log("process.env.NODE_ENV" + process.env.NODE_ENV)
                        this.wxLoginToken = res.message;
                        let url = Vue.prototype.mUrl + "phoneBindWechat/wx/login.html?token=" + res.message;
                        // console.log("二维码url："+url)
                        this.overdue = false;
                        this.$nextTick(function () {
                            this.qrcode(url);
                        })
                        let that = this;
                        setTimeout(function () {
                            console.log("设置为二维码过期")
                            that.overdue = true;
                        }, this.overdueTimeout);　　//三秒之后执行函数
                        this.checkToken();
                        //登录成功去首页
                        // this.$message.success('登录成功');

                    }
                });
            }
        },
        //生成授权二维码
        qrcode(url) {
            console.log("二维码url：" + url)
            let qrcode = new QRCode('qrcode', {
                width: 250,
                height: 250,
                text: url, // 二维码地址
            })
        },
        //清除二维码
        clearQrcode() {
            const codeHtml = document.getElementById("qrcode");
            codeHtml.innerHTML = "";
        },
        refreshToken() {
            wxLogin_setToken({}).then(res => {
                if (res.code == 200) {
                    //alert(res.message)
                    //$("#qrcode").html("");
                    console.log("process.env.NODE_ENV", process.env.NODE_ENV)
                    this.wxLoginToken = res.message;
                    let url = Vue.prototype.mUrl + "phoneBindWechat/wx/login.html?token=" + res.message;
                    // console.log("二维码url："+url)
                    this.overdue = false;
                    this.clearQrcode()
                    this.$nextTick(function () {
                        this.qrcode(url);
                    })
                    let that = this;
                    setTimeout(function () {
                        console.log("设置为二维码过期")
                        that.overdue = true;
                    }, this.overdueTimeout);　　//三秒之后执行函数


                }
            });

        },//end of 微信二维码生成


        checkToken() {
            // this.$router.push({name:'bindWechat',query:{thirdToken:'dfdsfd'}})
            // return;
            wxLogin_check({"token": this.wxLoginToken}).then(res => {
                if (res.code == 200) {
                    //alert(res.message)
                    let loginState = res.result.loginState;
                    console.log("loginState   " + loginState)
                    if ('UNBIND' == loginState) {
                        console.log("前去绑定   " + loginState)
                        let thirdToken = res.result.thirdToken;
                        this.$router.push({name: 'bindWechat', query: {thirdToken: thirdToken}})
                    } else if ('REFUSE' == loginState) {//实际没有该流程了
                        this.qrcodeState = 2;//取消登录
                        //this.$router.push({name:'Index'})
                    } else if ('OK' == loginState) {
                        //this.$router.push({name:'Index'})
                        console.log("成功  " + loginState)
                        this.qrcodeState = 1;
                        console.log("杀掉timeout：" + this.timeoutId)
                        clearTimeout(this.timeoutId);//Timeout();
                        //登录接口
                        login({
                            'mobile': this.form.phone,
                            'password': this.form.code,
                            'loginType': 'WX_LOGIN_SUCCESS',
                            'loginToken': res.result.thirdToken,
                            'roleType': '0',
                        }).then(res => {
                            console.log(res);
                            this.loginProcess(res);

                        });
                    } else {
                        //console.log("等待情况  "+loginState)
                        let that = this;
                        this.timeoutId = setTimeout(function () {
                            //console.log("再次调用checkToken")
                            that.checkToken();//再次调用自己
                        }, 1000);　　//三秒之后执行函数
                    }
                }

            });

        },//end of 微信二维码生成


        //切换登录注册
        changeType(type) {
            this.type = type
            this.phone = ''
            this.code = ''
            this.disabledFlag = false
            //验证滑块重置
            this.isPassingFlag = false
            this.$refs.dragVerify.reset()
        },
        //获取验证码
        getCode() {
            this.$refs.form.validateField(['phone'], (valid) => {
                if (valid) return
                this.$refs.form.validateField('dragVerify', (valid) => {
                    if (valid) return
                    //获取验证码token
                    getSmsCodeToken({
                        'phone': this.form.phone
                    }).then(res => {
                        if (res.code == 200) {
                            var token = res.result.token
                            var sign = this.$md5(token + this.form.phone + 'EmxJk0VFBgtPfCU5XtZxiVk6rkIGBLwY')
                            //获取验证码接口
                            getSmsCode({
                                'token': token,
                                'mobile': this.form.phone,
                                'sign': sign
                            }).then(res => {
                                if (res.code == 200) {
                                    this.$message.success('验证码发送成功');
                                    let that = this
                                    that.disabledFlag = true
                                    let interval = window.setInterval(function () {
                                        that.codeName = '已发送' + that.time + 's';
                                        --that.time;
                                        if (that.time < 0) {
                                            that.codeName = "重新发送";
                                            that.time = 60;
                                            that.disabledFlag = false;
                                            window.clearInterval(interval);
                                        }
                                    }, 1000);
                                } else {
                                    this.$message.error(res.message);
                                }
                            });
                        } else {
                            this.$message.error(res.message);
                        }
                    });
                })
            });
        },
        //登录处理
        loginProcess(res) {
            if (res.code == 200) {
                //存储登录状态token
                localStorage.setItem('loginStatus', 1)
                localStorage.setItem('X-Access-Token', res.result.token)
                localStorage.setItem('userId', res.result.id)
                // res.result.infoFlag&&res.result.eduFlag&&res.result.intentionFlag
                if (true) {
                    //简历是否填写完整
                    let isFull = res.result.isFull
                    //获取用户信息
                    personInfo({
                        'id': res.result.id
                    }).then(res => {
                        if (res.code == 200) {
                            localStorage.setItem('userInfo', JSON.stringify(res.result))
                            //简历列表
                            resumeList().then(res => {
                                if (res.code == 200) {
                                    let list = res.result.records
                                    for (let i in list) {
                                        if (list[i].lanType == 0 && list[i].type == 0) {
                                            localStorage.setItem('resumeId', list[i].id)
                                        }
                                    }
                                    //登录成功去首页
                                    this.$message.success('登录成功');
                                    //有第一份简历去首页
                                    setTimeout(() => {
                                        if (isFull) {
                                            this.$router.push({name: 'Index'})
                                        } else {
                                            this.$router.push({name: 'PersonResume'})
                                        }
                                        /*if(this.back){
                                            this.$router.go(-1)
                                        }else{
                                            this.$router.push({name:'Index'})
                                        }*/
                                    }, 1000)
                                }
                            });
                        }
                    });
                } else {
                    var firstResume = {
                        resumId: res.result.resumId,//简历id
                        eduId: res.result.eduId,//教育经历id
                        workId: res.result.workId,//工作经验id
                        intentionId: res.result.intentionId,//求职意向id
                    }
                    localStorage.setItem('firstResume', JSON.stringify(firstResume))
                    localStorage.setItem('resumeId', res.result.resumId)
                    //获取用户信息
                    personInfo({
                        'id': res.result.id
                    }).then(res1 => {
                        if (res.code == 200) {
                            localStorage.setItem('userInfo', JSON.stringify(res1.result))
                            if (!res.result.infoFlag) {
                                //去填第一份简历 个人信息
                                setTimeout(() => {
                                    this.$router.push({name: 'FirstResume', query: {stepsActive: 0}})
                                }, 1000)
                            } else if (!res.result.eduFlag) {
                                //去填第一份简历 教育经历
                                setTimeout(() => {
                                    this.$router.push({name: 'FirstResume', query: {stepsActive: 1}})
                                }, 1000)
                            } else if (!res.result.workFlag) {
                                if (res1.result.jobFlag == 0) {
                                    //应届生实习生跳过工作经验
                                    setTimeout(() => {
                                        this.$router.push({name: 'FirstResume', query: {stepsActive: 3}})
                                    }, 1000)
                                } else if (res1.result.jobFlag == 1) {
                                    //去填第一份简历 工作经验
                                    setTimeout(() => {
                                        this.$router.push({name: 'FirstResume', query: {stepsActive: 2}})
                                    }, 1000)
                                }
                            } else if (!res.result.intentionFlag) {
                                //去填第一份简历 求职意向
                                setTimeout(() => {
                                    this.$router.push({name: 'FirstResume', query: {stepsActive: 3}})
                                }, 1000)
                            }
                        }
                    });
                }
            } else {
                this.$message.error(res.message);
            }
        },//end of loginProcess


        //注册/登录
        submit() {
            this.$refs.form.validate((valid) => {
                if (valid) {
                    let form = JSON.parse(JSON.stringify(this.form))
                    if (form.loginMode == 1) {
                        form = {
                            'mobile': this.form.phone,
                            'password': this.form.code,
                            'roleType': '0',
                            loginMode: 1
                        }
                    } else {
                        var encrypt = new JSEncrypt();
                        encrypt.setPublicKey('MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDRYwEHVtYKjqQ5VZEzVkPJqSWwokUy7GYZdjB+aUZDNioAWPXZ3A9HlOjp5FLbHEmLtIVt7qFX0U/E8xl9Ar1rePRUOijtxRBjpWTdW9f9DCw6CY7dPcXvxCKbshf1lSYEysu3Kphb+44/meqrGKuYnqJTYQVcjNXSmtMXFto08QIDAQAB');
                        form.password = encrypt.encrypt(form.password);
                    }
                    //登录接口
                    login(form).then(res => {
                        console.log(res);
                        this.loginProcess(res);

                    });
                } else {
                    return false;
                }
            });
        }//end of submit

    },
    //生命周期 - 创建完成（可以访问当前this实例）
    created() {
    },
    //生命周期 - 挂载完成（可以访问DOM元素）
    mounted() {
        this.back = this.$route.query.back
    }
};
</script>
<style lang="scss">
@mixin text-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@mixin text-ellipsisclamp($clamp) {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: $clamp;
    overflow: hidden;
}

@mixin transition {
    transition: all .3s;
}

.Login {
    .goRecruit {
        text-align: right;
        font-size: 16px;
        line-height: 44px;

        a {
            color: #ccc;
            font-size: 14px;
            margin-right: 10px;
        }
    }

    .el-input-group__append {
        padding: 0;
    }

    .header {
        height: auto;
        overflow: hidden;
        background: #fff;
        padding: 20px 0;
        position: relative;
        z-index: 0;

        .logo {
            width: 159px;
            margin-right: 110px;

            img {
                width: 100%;
            }
        }
    }

    .main {
        width: 100%;
        height: 684px;
        padding-top: 50px;
        overflow: hidden;
        background: url('../assets/login-bg.jpg') center no-repeat;
        background-size: cover;

        .box {
            width: 426px;
            height: 578px;
            background: #fff;
            padding: 16px;
            border-radius: 5px;
            user-select: none;

            .wechatLoginFlag {
                height: 38px;
                font-size: 13px;
                color: #999;
                cursor: pointer;

                span {
                    width: 38px;
                    height: 38px;
                    background: url('../assets/wechatLogin.png') center no-repeat;
                    background-size: 100%;
                    display: inline-block;
                    vertical-align: -10px;
                }
            }

            .tabs {
                height: auto;
                overflow: hidden;
                text-align: center;
                margin-top: 50px;

                .item {
                    font-size: 20px;
                    color: #999;
                    display: inline-block;
                    margin: 0 50px;
                    cursor: pointer;

                    &.active {
                        color: #000;
                        font-weight: bold;
                    }

                    a {
                        color: #999;
                    }
                }
            }

            .form {
                width: 330px;
                height: auto;
                overflow: hidden;
                margin: 40px auto;
                margin-bottom: 0;

                .el-form-item {
                    position: relative;

                    .el-input {
                        position: relative;
                        z-index: 0;
                    }

                    .el-input__inner {
                        height: 42px;
                        line-height: 42px;
                        border-radius: 0;
                    }

                    .drag_verify {
                        line-height: 40px !important;
                        border: 1px solid #DCDFE6;

                        .dv_text {
                            color: #333;
                        }
                    }

                    &.code {
                        .el-button {
                            height: 39px;
                            padding: 0 15px;
                            position: absolute;
                            z-index: 1;
                            right: 1px;
                            top: 2px;
                            background: #fff;

                            span {
                                position: relative;
                                top: -1px;
                            }
                        }
                    }

                    &.other {
                        border: 0;
                        font-size: 13px;
                        color: #9E9E9E;
                        margin-top: 50px;

                        a {
                            color: #E54437;

                            &:hover {
                                color: #E54437;
                            }
                        }

                        .el-checkbox {
                            margin-right: 5px
                        }

                        .right {
                            cursor: pointer;

                            span {
                                color: #E54437;
                            }
                        }

                        .wechat {
                            @include transition();
                            cursor: pointer;

                            i {
                                font-size: 18px;
                                vertical-align: -2px;
                                margin-right: 5px
                            }

                            &:hover {
                                color: #00BA0E;
                            }
                        }
                    }
                }

                .btn {
                    width: 100%;
                    height: 50px;
                    font-size: 16px;
                    border-radius: 0;
                }
            }
        }
    }

    .footer {
        width: 100%;
        height: 100px;
        padding: 30px 0;

        .copyRight {
            height: 40px;
            line-height: 40px;
            font-size: 14px;
            color: #999;

            a {
                color: #999;
            }
        }

        .friendLink {
            height: 40px;
            line-height: 40px;
            text-align: center;

            .label {
                font-size: 14px;
                color: #999;
                display: inline-block;
            }

            .box {
                width: 221px;
                height: 40px;
                border: 1px solid #DCDFE6;
                font-size: 14px;
                color: #999;
                display: inline-block;
                text-align: left;
                position: relative;

                .active {
                    padding: 0 15px;
                    cursor: pointer;
                    @include transition();
                    position: relative;

                    a {
                        color: #999;

                        &:hover {
                            color: #333;
                        }
                    }

                    &:after {
                        content: "";
                        width: 100%;
                        height: 1px;
                        background: rgba($color: #eee, $alpha: .08);
                        position: absolute;
                        left: 0;
                        top: 0;
                    }
                }

                dl {
                    display: none;
                    height: 0;
                    max-height: 260px;
                    overflow: hidden;
                    width: 220px;
                    position: absolute;
                    right: 0;
                    bottom: 39px;
                    border: 1px solid #DCDFE6;
                    border-bottom: 0;
                    background: #fff;

                    dd {
                        padding: 8px 15px;
                        line-height: normal;
                        cursor: pointer;
                        @include transition();

                        a {
                            color: #999;

                            &:hover {
                                color: #333;
                            }
                        }
                    }
                }

                &:hover {
                    dl {
                        height: auto;
                        overflow: auto;
                        padding: 8px 0;
                        display: block;
                    }
                }

                ::-webkit-scrollbar {
                    width: 5px;
                }
            }
        }
    }

    .wechatLoginPop {
        width: 100%;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 99;
        background: rgba($color: #000, $alpha: .85);

        .btnClose {
            position: absolute;
            right: 30px;
            top: 30px;
            color: #999;
            font-size: 30px;
            cursor: pointer;
            @include transition();

            &:hover {
                color: #fff;
            }
        }

        .wrap {
            width: 280px;
            height: 425px;
            position: relative;
            margin: auto;
            margin-top: 12%;

            .iframe {
                width: 100%;
                height: 425px;
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                margin: auto;

                .title {
                    text-align: center;
                    font-size: 20px;
                    color: #fff;
                }

                .qr {
                    width: 280px;
                    height: 280px;
                    margin-top: 15px;
                    border: 1px solid #E2E2E2;
                    padding: 15px;
                    background: #fff;

                    img {
                        width: 100%;
                        height: 100%;
                    }
                }

                .info {
                    width: 280px;
                    margin: 15px auto;
                    background-color: #232323;
                    box-shadow: inset 0 5px 10px -5px #191919, 0 1px 0 0 #444;
                    border-radius: 100px;
                    padding: 10px 0;

                    .state {
                        position: relative;

                        i {
                            font-size: 34px;
                            position: absolute;
                            left: 15px;
                            top: 5px;
                        }

                        p {
                            font-size: 13px;
                            color: #fff;
                            line-height: 22px;
                        }

                        &.state0 {
                            text-align: center;
                        }

                        &.state1, &.state2 {
                            padding-left: 60px
                        }

                        &.state1 {
                            i {
                                color: #70b838;
                            }
                        }

                        &.state2 {
                            i {
                                color: #e18c6d;
                            }
                        }
                    }
                }
            }

            iframe {
                width: 100%;
                height: 425px;
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                margin: auto;
            }

            .overdue {
                display: block;
                width: 280px;
                height: 280px;
                position: absolute;
                top: 40px;
                left: 0;
                background-color: rgba(255, 255, 255, .9);
                text-align: center;

                .txt {
                    margin-top: 90px;
                    font-size: 20px;
                    color: #414a60;
                    letter-spacing: 1px;
                    margin-bottom: 20px
                }

                .btn {
                    width: 150px;
                    font-size: 16px;
                }
            }
        }
    }

    .agreement {
        .box {
            height: 500px;
            overflow: auto;

            h2 {
                font-size: 15px;
                color: #333;
                line-height: 26px;
                font-weight: bold;
                margin-bottom: 10px;
                text-indent: 30px;
            }

            p {
                font-size: 15px;
                color: #333;
                line-height: 26px;
                margin-bottom: 10px;
                text-indent: 30px;
            }
        }
    }
}
</style>
